<template>
	<view>
		<u-navbar bgColor="transparent" leftIconColor="#fff" :autoBack="true">
		</u-navbar>
		<image src="https://bhzhtc.oss-cn-beijing.aliyuncs.com/sxsd/ff5e6f5bfa504bd88ab5629518321aa0.png"
			style="width: 750rpx;" mode="widthFix"></image>
		<view class="my-avatar">
			<u-avatar :src="userInfo.avatar" size="135rpx"></u-avatar>
			<view style="margin-left: 23rpx;">
				<view style="font-weight: 500;font-size: 35rpx;">{{userInfo.nickName}}</view>
				<view style="margin-top: 8rpx;">{{userInfo.phonenumber}}</view>
			</view>
		</view>
		<view class="my-cash">
			<view>
				<view>账户余额</view>
				<view>￥{{userInfo.balance}}</view>
			</view>
			<view class="cash-but" @click="goWithdraw">提现</view>
		</view>
		<view class="my-order">
			<view>我的订单</view>
			<view class="order-list">
				<!-- <view class="order-item" @click="swithTab(0)">
					<image src="../../static/procure/mine_order_all@3x.png" style="width: 80rpx;" mode="widthFix">
					</image>
					<view style="margin-top: 10rpx;">全部</view>
				</view> -->
				<view class="order-item" @click="swithTab(0)">
					<image src="../../static/procure/mine_order_daiShouHuo@3x.png" style="width: 80rpx;"
						mode="widthFix">
					</image>
					<view style="margin-top: 10rpx;">待收货</view>
				</view>
				<view class="order-item" @click="swithTab(1)">
					<image src="../../static/procure/mine_order_received@3x.png" style="width: 80rpx;" mode="widthFix">
					</image>
					<view style="margin-top: 10rpx;">已收货</view>
				</view>
			</view>
		</view>
		<view @click="goDetail" class="my-order" style="display: flex;align-items: center;">
			<image src="../../static/procure/administrator@3x.png" style="width: 54rpx;" mode="widthFix"></image>
			<view style="margin-left: 23rpx;">我的供货商</view>
		</view>
		<!-- <view @click="goSet" class="my-order" style="display: flex;align-items: center;">
			<image src="../../static/procure/set@3x.png" style="width: 54rpx;" mode="widthFix"></image>
			<view style="margin-left: 23rpx;">设置</view>
		</view> -->
	</view>
</template>

<script>
	import {
		mapGetters,
	} from 'vuex'
	export default {
		data() {
			return {

			}
		},
		computed: mapGetters(['userInfo']),
		mounted() {
			console.log(this.userInfo);
		},
		methods: {
			swithTab(index) {
				console.log(1);
				this.$emit('goOrder', index)
			},
			goDetail() {
				this.$yrouter.push({
					path: '/procurement/supplier/supplier'
				})
			},
			goSet() {
				this.$yrouter.push({
					path: '/procurement/set/set'
				})
			},
			goWithdraw() {
				uni.navigateTo({
					url: '/procurement/withdraw/withdraw'
				})
			},
		},

	}
</script>

<style lang="scss" scoped>
	.my-avatar {
		position: absolute;
		top: 186rpx;
		left: 31rpx;
		display: flex;
		align-items: center;
		color: #333333;
		font-size: 25rpx;
	}

	.my-cash {
		width: 688rpx;
		height: 171rpx;
		background: linear-gradient(315deg, #3CE198 0%, #2FCC71 100%);
		border-radius: 19rpx;
		margin: 0 auto;
		margin-top: -85rpx;
		display: flex;
		align-items: center;
		padding: 23rpx;
		box-sizing: border-box;
		font-weight: 500;
		color: #FFFFFF;
		font-size: 35rpx;
	}

	.cash-but {
		margin-left: auto;
		width: 130rpx;
		height: 58rpx;
		background: #FFFFFF;
		border-radius: 29rpx;
		color: #2FCC71;
		font-size: 25rpx;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.my-order {
		width: 688rpx;
		background: #FFFFFF;
		border-radius: 19rpx;
		margin: 31rpx auto;
		font-weight: 500;
		color: #333333;
		font-size: 31rpx;
		padding: 23rpx;
		box-sizing: border-box;
	}

	.order-list {
		margin-top: 29rpx;
		display: flex;
		align-items: center;
		justify-content: space-around;
	}

	.order-item {
		display: flex;
		flex-direction: column;
		align-items: center;
		font-weight: 400;
		color: #999999;
		font-size: 25rpx;
	}
</style>